<template>
	<view class="bigbox">
		<view>
			  <picker @change="bindPinpaiChange" :value="pinpaiindex" :range="pinpai">
				<view>
					  <span class="title">品牌：</span>
					  <text class="pickitem">{{pinpai[pinpaiindex]}}</text>
					  <text class="lg text-blue cuIcon-unfold"></text>
				</view>
			  </picker>
		</view>
		<view>
		  <picker @change="bindPriceChange" :value="priceindex" :range="price">
			<view >
				  <span class="title">排序：</span>
				  <span class="pickitem">{{price[priceindex]}}</span>
				  <text class="lg text-blue cuIcon-unfold"></text>
			</view>
		  </picker>
		</view>
	</view>
</template>

<script>
	export default {
		name:"Picker-my",
		props:{
			pinpai:{
				type:Array,
				required:true
			},
			price:{
				type:Array,
				required:true
			},
			pinpaiindex:{
				type:Number,
				required:false,
				default:0
			},
			priceindex:{
				type:Number,
				required:false,
				default:0
			}
		},
		data() {
			return {
				
			
			};
		},
		methods:{
			bindPinpaiChange: function(e) {
				 this.$emit('changeGrand', e.target.value)
			 },
			 bindPriceChange: function(e) {
				 this.$emit('changeOrder',e.target.value)
			  },
		}
	}
</script>

<style lang="scss" scoped>
	.bigbox{
		height: 8vh;
		width: 70vw;
		display: flex;
		flex-direction: row;
		justify-content: space-around;
		align-items: center;
	}
	.title{
		font-size: 14px;
	}
	.pickitem{
		color: #1296db;
		margin-right: 3px;
		font-size:14px
	}
</style>
